<template>
	<view>
		<!-- <image src="/static/xgbj.png" class="qjimg" mode=""></image> -->
		<!-- <view class="top1" :style="'margin-top:'+CustomBar+'px;'">
			全部功能
		</view> -->
		<view class="title">
			社区服务
		</view>
		<view class="list">
			<view class="" v-for="(item,index) in shequ" :key="index">
				<view class="list1" v-if="item.isver?(varing?false:true):true"
					@click="$gopage(item.path,1,item.islogin)">
					<image :src="item.icon[0]" mode=""></image>
					<view class="">
						{{item.title}}
					</view>
				</view>
			</view>



		</view>
		<view class="title">
			比邻服务
		</view>
		<view class="list">
			<view class="" v-for="(item,index) in bilin" :key="index">
				<view class="list1" v-if="item.isver?(varing?false:true):true"
					@click="$gopage(item.path,1,item.islogin)">
					<image :src="item.icon[0]" mode=""></image>
					<view class="">
						{{item.title}}
					</view>
				</view>
			</view>
		</view>
		<view class="title">
			常用功能
		</view>
		<view class="list">
			<view class="" v-for="(item,index) in changyong" :key="index">
				<view class="list1" v-if="item.isver?(varing?false:true):true"
					@click="$gopage(item.path,1,item.islogin)">
					<image :src="item.icon[0]" mode=""></image>
					<view class="">
						{{item.title}}
					</view>
				</view>
			</view>
		</view>
		<view class="" style="width: 100rpx;height: 180rpx;">

		</view>

		<tabbar :selected="1" :vering="vering"></tabbar>
	</view>
</template>

<script>
	var that;
	export default {
		data() {
			return {
				CustomBar: 0,
				list: [],
				shequ: [],
				bilin: [],
				changyong: [],
				varing: ''
			}
		},
		onLoad() {
			that = this
			let menuButtonInfo = uni.getMenuButtonBoundingClientRect()
			that.CustomBar = menuButtonInfo.top * 1 + 6
			this.vering = uni.getStorageSync('vering')
			that.getlist()
		},
		onShow() {
			uni.hideTabBar({
				animation: false
			})
		},
		methods: {
			getlist() {
				that.$post('api/getnav', {}).then(res => {
					console.log('1231231', res.list);
					res.list.forEach(item => {
						if (item.islogin == 1) {
							item.islogin = 0
						} else {
							item.islogin = 1
						}
						if (item.type == 1) {
							that.shequ.push(item)

						} else if (item.type == 2) {
							that.bilin.push(item)
						} else if (item.type == 3) {
							that.changyong.push(item)
						}
					})
				})
			}
		}
	}
</script>

<style lang="scss">
	.top1 {
		font-size: 36rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #000000;
		text-align: center;
	}

	.title {
		width: 160rpx;
		text-align: center;
		padding: 6rpx 0;
		margin-left: 50rpx;
		margin-top: 50rpx;
		font-size: 30rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #333333;
		line-height: 20rpx;
		border-left: #F76D1F solid 4px;
	}

	.qjimg {
		width: 750rpx;
		height: 100vh;
		position: absolute;
		top: 0;
		z-index: -1;
	}

	.list {
		width: 680rpx;
		margin: 10rpx auto;
		display: flex;
		flex-wrap: wrap;
	}

	.list1 {
		width: 100rpx;
		margin: 0 35rpx;
		margin-top: 40rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;

		>image {
			width: 64rpx;
			height: 62rpx;
		}

		>view {
			margin-top: 30rpx;
			font-size: 24rpx;
			font-family: Source Han Sans CN;
			font-weight: 500;
			color: #666666;
		}
	}
</style>
